Fold the DOM like paper.

Use your mouse or touch to manipulate these, or press the fold button to see a random effect:

• Hello.

  from DOM-land

  accordion(20)

  fold
• reveal(30)

  fold

• Late
  Capitalism

  reveal(40)

  fold

• Tennis
  Court
  Oath

  accordion(-20)

  fold
• Ersatz
  stairs(18)

  fold

• 
  /*
  
   $$$$$$\            $$\ $$$$$$$\                          $$\
  $$  __$$\           \__|$$  __$$\                         \__|
  $$ /  $$ | $$$$$$\  $$\ $$ |  $$ | $$$$$$\  $$$$$$\$$$$\  $$\
  $$ |  $$ |$$  __$$\ $$ |$$ |  $$ |$$  __$$\ $$  _$$  _$$\ $$ |
  $$ |  $$ |$$ |  \__|$$ |$$ |  $$ |$$ /  $$ |$$ / $$ / $$ |$$ |
  $$ |  $$ |$$ |      $$ |$$ |  $$ |$$ |  $$ |$$ | $$ | $$ |$$ |
   $$$$$$  |$$ |      $$ |$$$$$$$  |\$$$$$$  |$$ | $$ | $$ |$$ |
   \______/ \__|      \__|\_______/  \______/ \__| \__| \__|\__|
  
  v. 1.0.0
  
  */
  
  var demo6 = new OriDomi('.demo6', {
    hPanels: 4,
    ripple:  true,
    shading: false
  });
  
  

  stairs(20)

  fold
• reveal(45)

  fold

  * This demo illustrates the ability to define custom panel sizes: the proportions here follow a reversed Fibonacci Sequence (1, 1, 2, 3, 5, 8, 13, 21, 34).